<template>
  <div class="personal-main">
    <div class="personal-pay">
      <h3><i>我的企业</i></h3>

      <el-steps :active="active" style="margin: 40px 40px 40px 80px">
        <el-step title="协议"></el-step>
        <el-step title="创建企业"></el-step>
        <el-step title="企业详情"></el-step>
        <el-step title="等待认证结果"></el-step>
      </el-steps>

      <div v-if="active === 1" class="user-borrower">
        <el-form label-width="150px">
          <div style="margin: 40px 40px 60px 80px">
            <el-alert
                title="请阅读以下协议......"
                type="warning"
                show-icon
                :closable="false"
            >
              “借贷平台”服务条例<br/>
              1、具有合法的身份证件，即具有合法的公民身份；<br/>
              2、具有良好的个人信用，有偿还贷款本息的能力；<br/>
            </el-alert>
            <el-form
                ref="ruleForm"
                :model="ruleForm"
                :rules="rules"
                label-width="100px"
                autocomplete="off"
                size="medium"
                style="margin:30px 0 5px -80px "
            >
              <el-form-item prop="agreed">
                <el-checkbox v-model="ruleForm.agreed">同意借贷协议</el-checkbox>
              </el-form-item>
            </el-form>

          </div>
          <el-form-item>
            <el-button
                type="primary"
                :disabled="submitBtnDisabled"
                @click="save"
            >
              下一步
            </el-button>
          </el-form-item>
        </el-form>
      </div>

      <div v-if="active === 2" class="user-borrower">
        <el-form label-width="150px">

          <el-form-item label="公司名称" prop="companyFullName" size="mini">
            <el-input v-model="company.companyFullName" />
          </el-form-item>

          <el-form-item label="公司地址" prop="companyAddress" size="mini">
            <el-input v-model="company.companyAddress" />
          </el-form-item>

          <el-form-item label="统一社会信用代码" prop="companyCode">
            <el-col :span="18">
              <el-input v-model="company.companyCode" />
            </el-col>
          </el-form-item>

          <el-form-item label="企业法人姓名" prop="legalName">
            <el-input v-model="company.legalName" />
          </el-form-item>

          <el-form-item label="法人身份证号" prop="legalID">
            <el-col :span="18">
              <el-input v-model="company.legalID" />
            </el-col>
          </el-form-item>

          <el-form-item label="注册资金" prop="capital">
            <el-col :span="6">
              <el-input v-model="company.capital" />
            </el-col>
            <el-col :span="6">
              &nbsp;&nbsp;万元
            </el-col>
          </el-form-item>

          <el-form-item>

            <el-button
                type="primary"
                :disabled="submitBtnDisabled"
                @click="prev"
            >
              返回
            </el-button>
            <el-button
                type="primary"
                :disabled="submitBtnDisabled"
                @click="saves"
            >
              提交
            </el-button>
          </el-form-item>
        </el-form>
        <el-alert
            title="您提供的任何信息我们都承诺予以保护，不会挪作他用。"
            type="warning"
            :closable="false"
        >
        </el-alert>
      </div>

      <div v-if="active === 3" class="user-borrower">
        <el-form label-width="150px">

          <el-form-item label="公司名称">
            ：{{company.companyFullName}}
          </el-form-item>

          <el-form-item label="公司地址">
            ：{{company.companyAddress}}
          </el-form-item>

          <el-form-item label="统一社会信用代码">
            ：{{company.companyCode}}
          </el-form-item>

          <el-form-item label="企业法人姓名">
            ：{{company.legalName}}
          </el-form-item>

          <el-form-item label="法人身份证号">
            ：{{company.legalID}}
          </el-form-item>

          <el-form-item label="注册资金" prop="capital">
            ：{{company.capital}}万元
          </el-form-item>

          <el-form-item>
            <el-button
                type="primary"
                :disabled="submitBtnDisabled"
                @click="prev"
            >
              暂不认证
            </el-button>
            <el-button
                type="primary"
                :disabled="submitBtnDisabled"
                @click="save"
            >
              认证
            </el-button>
          </el-form-item>
        </el-form>
        <el-alert
            title="您提供的任何信息我们都承诺予以保护，不会挪作他用。"
            type="warning"
            :closable="false"
        >
        </el-alert>
      </div>

      <div v-if="active === 4" class="user-borrower">
        <el-form label-width="150px">
          <div style="margin: 40px 40px 60px 80px">
            <el-alert
                title="您的企业认证申请已成功提交，请耐心等待认证结果"
                type="warning"
                show-icon
                :closable="false"
            >
              我们将在48h内完成审核，审核时间为周一至周五9:00至17:00。
            </el-alert>
          </div>
        </el-form>
      </div>

      <div v-if="active === 5" class="user-borrower">
        <div style="margin: 40px 40px 60px 80px" v-if="borrowInfoStatus == 1">
          <el-alert
              title="您的企业认证正在审批中"
              type="success"
              show-icon
              :closable="false"
          >
          </el-alert>
        </div>
        <div style="margin: 40px 40px 60px 80px" v-if="borrowInfoStatus == 2">
          <el-alert
              title="您的企业认证核实已通过"
              type="success"
              show-icon
              :closable="false"
          >
          </el-alert>
        </div>
        <div style="margin: 40px 40px 60px 80px" v-if="borrowInfoStatus == -1">
          <el-alert
              title="您的企业认证核实未通过，请重新认证"
              type="error"
              show-icon
              :closable="false"
          >
          </el-alert>
        </div>
        <el-form label-width="100px" style="margin-right: 300px">
          <el-descriptions style="margin-left: 180px;margin-top: 50px" direction="vertical" :column="1" border>
            <el-descriptions-item label="公司名称">{{companyNew.companyFullName}}</el-descriptions-item>
            <el-descriptions-item label="公司地址">{{companyNew.companyAddress}}</el-descriptions-item>
            <el-descriptions-item label="统一社会信用代码">{{companyNew.companyCode}}</el-descriptions-item>
            <el-descriptions-item label="法定代表人身份证号">{{companyNew.legalName}}</el-descriptions-item>
            <el-descriptions-item label="注册资金">{{companyNew.capital}}</el-descriptions-item>
          </el-descriptions>
        </el-form>
        <el-button style="margin: 20px 10px 10px 300px" type="primary" @click="cancled">
          重新认证
        </el-button>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  name: "apply",
  data() {
    let isAgreed = (rule, value, callback)=>{
      if (!value){
        callback(new Error('请确认同意注册协议'))
      }else {
        callback()
      }
    }
    return {
      company: {
        companyFullName: '',//公司名称
        companyAddress:'',//公司地址
        companyCode:'',//统一社会信用代码
        legalName:'',//企业法定代表人姓名
        legalID:'',//法定代表人身份证号
        capital:'',//注册资金
      },

      companyNew: {
        companyFullName: '',//公司名称
        companyAddress:'',//公司地址
        companyCode:'',//统一社会信用代码
        legalName:'',//企业法定代表人姓名
        legalID:'',//法定代表人身份证号
        capital:'',//注册资金
        borrowInfoStatus:'',//审批状态
      },

      active: 1, //步骤
      borrowInfoStatus: 1, //审批状态
      submitBtnDisabled: false,

      second: 20, // 倒计时间
      leftSecond: 0, //剩余时间

      ruleForm: {
        agreed:'',
      },

      rules:{
        agreed: [
          {required: true, message: '请确认同意注册协议', trigger: 'blur'},
          {validator:isAgreed}
        ],
      },
      a:{}


    }

  },
  mounted() {
    this.$axios
        .post(`http://localhost:9090/loan/company/getCompanyByUid`).then(
        response => {
          this.a=response.data
          if (response.data.success==true){
            this.companyNew.companyFullName=response.data.obj.companyFullName
            this.companyNew.companyAddress=response.data.obj.companyAddress
            this.companyNew.companyCode=response.data.obj.companyCode
            this.companyNew.legalName=response.data.obj.legalName
            this.companyNew.legalID=response.data.obj.legalID
            this.companyNew.capital=response.data.obj.capital
            this.companyNew.borrowInfoStatus=response.data.obj.borrowInfoStatus
            this.active=5
            this.borrowInfoStatus=response.data.obj.borrowInfoStatus
          }
        }
    )
  },
  created() {
    this.$axios
        .post(`http://localhost:9090/loan/company/getCompanyByUid`).then(
        response => {
          this.a=response.data
          if (response.data.success==true){
            this.companyNew.companyFullName=response.data.obj.companyFullName
            this.companyNew.companyAddress=response.data.obj.companyAddress
            this.companyNew.companyCode=response.data.obj.companyCode
            this.companyNew.legalName=response.data.obj.legalName
            this.companyNew.legalID=response.data.obj.legalID
            this.companyNew.capital=response.data.obj.capital
            this.companyNew.borrowInfoStatus=response.data.obj.borrowInfoStatus
            this.active=5
            this.borrowInfoStatus=response.data.obj.borrowInfoStatus
          }
        }
    )
  },

  methods: {
    cancled() {
      var result = confirm("是否重新认证!重新认证原有信息将删除")
      if (result==true){
        this.$axios
            .post(`http://localhost:9090/loan/company/deleteCompanyByUid`).then(
            response => {
              console.log(response.data.success)
              if (response.data.success==true){
                this.active=1
              }
            }
        )
      }
    },
    //提交企业认证申请
    save() {

      if (!(this.ruleForm.agreed)){
        this.$message({
          type: 'info',
          message: "请确认同意注册协议"
        })
      }

      if (this.active==1 && this.ruleForm.agreed){
        this.active++
      }else if (this.active==2){
        this.active++
      }else if(this.active==3){
        this.active++
        this.$axios
            .post(`http://localhost:9090/loan/company/addCompany`, this.$qs.stringify(this.company)).then(
            response => {
              console.log(response.data)
              if (response.data.success==true){
                this.$message({
                  type: 'success',
                  message: "认证已成功提交"
                })
              }else {
                this.$message({
                  type: 'info',
                  message: "认证提交失败"
                })
              }

            }
        )
        this.leftSecond = this.second

        const timmer = setInterval(() => {
          this.leftSecond--
          if (this.leftSecond <= 0) {
            //停止计时
            this.active = 5
            clearInterval(timmer)
            this.sending = false
          }
        }, 1000)
      }


    },
    saves(){
      if (!(this.company.companyFullName)){
        this.$message({
          type: 'info',
          message: "请填写公司名称"
        })
      }else if (!(this.company.companyAddress)){
        this.$message({
          type: 'info',
          message: "请填写公司地址"
        })
      }else if (!(this.company.companyCode)){
        this.$message({
          type: 'info',
          message: "请填写统一社会信用代码"
        })
      }else if (!(this.company.legalName)){
        this.$message({
          type: 'info',
          message: "请填写企业法人姓名"
        })
      }else if (!(this.company.legalID)){
        this.$message({
          type: 'info',
          message: "请填写法人身份证号"
        })
      }else if (!(this.company.capital)){
        this.$message({
          type: 'info',
          message: "请填写注册资金"
        })
      }else if (
          (this.company.companyFullName)||
          (this.company.companyAddress)||
          (this.company.companyCode)||
          (this.company.legalName)||
          (this.company.legalID)||
          (this.company.capital)
      ){
        this.active++
      }
    },
    //提交企业认证申请
    prev() {
      this.active -= 1
    },

    timeDown() {
      console.log('倒计时')
      this.leftSecond = this.second

      const timmer = setInterval(() => {
        this.leftSecond--
        if (this.leftSecond <= 0) {
          //停止计时
          this.active = 5
          clearInterval(timmer)
          this.sending = false
        }
      }, 1000)
    },

  },
}
</script>

<style scoped>

</style>
